{template 'common/header'}
<ul class="we7-page-tab">
	<li class="active"><a href="{url 'statistics/app'}">访问统计信息</a></li>
	<li><a href="{url 'statistics/setting'}">访问统计设置</a></li>
</ul>
<div class="api" id="js-statistics-app-display" ng-controller="HorizontalBarCtrl" ng-cloak>
	<div class="panel we7-panel api-target">
		<div class="panel-heading">今日/昨日关键指标</div>
		<div class="panel-body we7-padding-vertical">
			<div class="col-sm-4 text-center">
				<div class="title">应用总访问数</div>
				<div>
					<span class="today">{$today_module_api['visit_sum']}</span>
					<span class="yesterday">/ {$yesterday_module_api['visit_sum']}</span>
				</div>
			</div>
			<div class="col-sm-4 text-center">
				<div class="title">应用平均访问数</div>
				<div>
					<span class="today">{$today_module_api['visit_avg']}</span>
					<span class="yesterday">/ {$yesterday_module_api['visit_avg']}</span>
				</div>
			</div>
			<div class="col-sm-4 text-center">
				<div class="title">应用最高访问数</div>
				<div>
					<span class="today">{$today_module_api['visit_highest']}</span>
					<span class="yesterday">/ {$yesterday_module_api['visit_highest']}</span>
				</div>
			</div>
		</div>
	</div>
	<div class="we7-margin-vertical color-dark font-lg">公众号API访问统计</div>
	<div class="panel we7-panel">
		<div class="panel-heading tab">
			<a href="javascript:;">关键指标详解</a>
			<a href="javascript:;" ng-class="{'active': accountDivideType == 'bysum'}" ng-click="changeDivideType('account', 'bysum')">公众号总访问数</a>
			<a href="javascript:;" ng-class="{'active': accountDivideType == 'byavg'}" ng-click="changeDivideType('account', 'byavg')">公众号平均访问数</a>
			<a href="javascript:;" ng-class="{'active': accountDivideType == 'byhighest'}" ng-click="changeDivideType('account', 'byhighest')">公众号最高访问数</a>
		</div>
		<div class="panel-body data-view">
			<div class="tab-bar-time clearfrix">
				<span class="we7-margin-right">时间</span>
				<div class="btn-group" role="group">
					<button type="button" class="btn btn-default" ng-class="{'active': accountTimeType == 'today'}" ng-click="getModuleApi('account', 'today')">今日统计</button>
					<button type="button" class="btn btn-default" ng-class="{'active': accountTimeType == 'week'}" ng-click="getModuleApi('account', 'week')">周统计</button>
					<button type="button" class="btn btn-default" ng-class="{'active': accountTimeType == 'month'}" ng-click="getModuleApi('account', 'month')">月统计</button>
					<div class="btn-group" role="group">
						<button class="btn btn-default daterange daterange-date" we7-date-range-picker ng-model="accountDateRange"><span>{{accountDateRange.startDate}} </span>至<span> {{accountDateRange.endDate}}</span> <i class="fa fa-calendar"></i></button>
					</div>
				</div>
			</div>
			<div class="col-sm-12" id="chart-line" style="height:500px"></div>
		</div>
	</div>
	<div class="we7-margin-vertical color-dark font-lg">应用模块API统计</div>
	<div class="panel we7-panel">
		<div class="panel-heading tab">
			<a href="javascript:;">关键指标详解</a>
			<a href="javascript:;" ng-class="{'active': moduleDivideType == 'bysum'}" ng-click="changeDivideType('module', 'bysum')">总访问数</a>
			<a href="javascript:;" ng-class="{'active': moduleDivideType == 'byavg'}" ng-click="changeDivideType('module', 'byavg')">平均访问数</a>
			<a href="javascript:;" ng-class="{'active': moduleDivideType == 'byhighest'}" ng-click="changeDivideType('module', 'byhighest')">最高访问数</a>
		</div>
		<div class="panel-body data-view">
			<div class="tab-bar-time clearfrix">
				<span class="we7-margin-right">时间</span>
				<div class="btn-group" role="group">
					<button type="button" class="btn btn-default" ng-class="{'active': moduleTimeType == 'today'}" ng-click="getModuleApi('module', 'today')">今日统计</button>
					<button type="button" class="btn btn-default" ng-class="{'active': moduleTimeType == 'week'}" ng-click="getModuleApi('module', 'week')">周统计</button>
					<button type="button" class="btn btn-default" ng-class="{'active': moduleTimeType == 'month'}" ng-click="getModuleApi('module', 'month')">月统计</button>
					<div class="btn-group" role="group">
						<button class="btn btn-default daterange daterange-date" we7-date-range-picker ng-model="moduleDateRange"><span>{{moduleDateRange.startDate}} </span>至<span> {{moduleDateRange.endDate}}</span> <i class="fa fa-calendar"></i></button>
					</div>
				</div>
			</div>
			<div class="col-sm-12">
				<div id="chart-horizontal-bar" style="height:1000px"></div>
			</div>
			<div class="col-sm-12">
				{if user_is_founder($_W['uid']) && !user_is_vice_founder()}
				<div class="we7-margin-vertical text-right">
					<a href="javascript:;" class="color-default" ng-click="changeStatus()">
						解决访问统计没数据的方法 <span class="wi wi-angle-up"></span>
					</a>
				</div>
				<div class="distribution-steps" ng-show = "show==true">
					<div class="steps-container">
						<div>
							<div class="num">1</div>
							<div class="title">
								<span class="wi wi-warning-sign"></span>应用没有统计数据
							</div>
							<div class="content">
								没有应用的统计数据，是因为模块内没有统计数据的代码，需要复制第2步的代码到对应的模块内。然后联系应用模块开发者更新提交代码，完成后即可生成统计数据。
							</div>
						</div>
						<div>
							<div class="num">2</div>
							<div class="title">
								<span class="wi wi-code"></span>复制代码
							</div>
							<div class="content">
								<textarea class="form-control code-container we7-margin-bottom-sm" ng-model="code">
								</textarea>
								<div><a href="javascript:;" id="copy-1" class="btn btn-primary" clipboard supported="supported" text="code"
									 on-copied="success(1);">复制代码</a></div>
							</div>
						</div>
						<div>
							<div class="num">3</div>
							<div class="title">
								<span class="wi wi-help"></span>联系开发者
							</div>
							<div class="content">
								找到没有统计数据的应用，联系<span class="color-default">应用模块的开发者</span>，让开发者将代码更新提交后，则可生成模块的统计数据。
							</div>
						</div>
					</div>
				</div>
				{/if}

			</div>
		</div>
	</div>
</div>
<script>
require(['daterangepicker'], function() {
	angular.module('statisticsApp').value('config', {
		'links': {
			'accountApi': "{php echo url('statistics/app/get_account_api')}",
			'moduleApi': "{php echo url('statistics/app/get_module_api')}",
		},
	});
	angular.bootstrap($('#js-statistics-app-display'), ['statisticsApp']);
})
</script>
{template 'common/footer'}